<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script>
      //console.log(document.getElementsByClassName("box")[0]);
      //页面尚未加载完毕，无法获取到DOM节点  若想获得必须放在onload里面
      /* window.onload = function(){
        console.log(document.getElementsByClassName("box")[0]);
    } */
      onload = function () {
        //如果DOM对象是window，window可以省略
        console.log(document.getElementsByClassName("box")[0]);
      };
    </script>
  </head>
  <body>
    <div class="box">box</div>
    <a href="https://baidu.com" target="_blank">百度</a>
    <button id="jump">百度</button>
    <input type="text" id="name" />
    <div style="height: 1200px"></div>
  </body>
  <script>
    // 1)onload
    document.body.onload = function () {
      //   alert("页面加载完毕");
      console.log(document.getElementsByClassName("box")[0]);
    };

    // 2)onunload
    onunload = function () {
      //当页面被关闭或被切换时，一般用于垃圾回收处理，清空缓存等操作。
      //   alert("该页面被关闭");
    };

    // 3)onabort
    window.onabort = function () {
      //   alert("abort"); 不会被执行
    };

    // 4)onerror
    // window.onerror = function () {
    //   alert("页面有错误");
    // };
    // test(); 语法错误

    // 5)onselect
    document.getElementById("name").onselect = function () {
      alert("这是select事件");
    };
    /*  document.getElementsByClassName("box").onselect = function () { 
        alert("这是select事件")
     } 只能用于表单*/

    // 6)onresize
    window.onresize = function () {
      console.log(window.innerHeight);
    };

    // 7)onscroll
    window.onscroll = function () {
      console.log(Math.round(window.scrollY));
    };
    // window.addEventListener("scroll",function () { 
    //   console.log(Math.round(window.scrollY));
    //  })
  </script>
</html>
